<%@ include file="/WEB-INF/views/commonJSTL.jsp" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
	<head>
	<title>FarmaSoft</title>
	<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
	<%@ include file="/WEB-INF/views/commonResources.jsp" %>
	<script type="text/javascript">
	var listParts = [];
	var listTowns = [];
	
	// load regions
	<c:forEach var="region" items="${parts}">
		var region = {countryId:"<c:out value="${region.countryId.countryId}"/>",regionId:"<c:out value="${region.regionId}"/>",name:"<c:out value="${region.name}"/>",initials:"<c:out value="${region.initials}"/>"};
		listParts.push(region);
	</c:forEach>
	
	// here we load object towns or localities
	<c:forEach var="locality" items="${towns}">
		var locality = {countryId:"<c:out value="${locality.region.countryId.countryId}"/>",regionId:"<c:out value="${locality.region.regionId}"/>",localityId:"<c:out value="${locality.localityPK.localityId}"/>",name:"<c:out value="${locality.name}"/>",initials:"<c:out value="${locality.initials}"/>",area:"<c:out value="${locality.area}"/>"};
		listTowns.push(locality);
	</c:forEach>
	
	$(document).ready(function(){
		$("#formProvider").validate();
		$("#dateCreation").datepicker(); // Here we initialit datepicker
		
		$("#countryId").change(function(){ // action change to contries
			var countryId = $(this).val();
			var element = $("#regionId");
			element.empty().append("<option value=''>Seleccione una Region</option>");
			if(countryId != ""){
				for(var i=0; i<listParts.length; i++){
					var region = listParts[i];
					if(countryId == region.countryId){
						element.append("<option value='"+region.regionId+"'>"+region.name+"</option>");
					}
				}
			}
			$("#localityId").empty().append("<option value='0'>Seleccione una Localidad</option>");
		});
		
		$("#regionId").change(function(){ // action change to parts or regions
			var regionId = $(this).val();
			var element = $("#localityId");
			element.empty().append("<option value='0'>Seleccione una Localidad</option>");
			if(regionId != ""){
				for(var i=0; i<listTowns.length; i++){
					var locality = listTowns[i];
					if(regionId == locality.regionId){
						element.append("<option value='"+locality.localityId+"'>"+locality.name+"</option>");
					}
				}
			}
		});
		
	});
	</script>
	</head>
<body>
<div id="top-wrap">
	<%@include file="../../../head.jsp"  %>
	<div id="bodySpace">
	    <div class="clearfix" id="middle" style="position: absolute">  <!-- aqui va la ruta -->
	        <div id="breadcrumb">
	            <ul><li><a href="mainFront?v=1">Home</a></li> <li><span style="color:#666">Administraci&oacute;n</span></li> <li class="current-page"><span class="end"><span class="middle">Administraci&oacute;n General</span></span></li></ul>
	            <!-- para la hora --> <!--<div style="clear: both;position: absolute;text-align: right;width: 100%;"><span id="fechaServ"></span>&nbsp;&nbsp;<span id="horaServ" style=""></span>&nbsp;</div>-->
	        </div>
	    </div>
	    <div id="principal">
            <div class="cuerpo2y" style="border: 0px solid"><br/><br/><!-- estos break son necesarios ya q uso absolute en css  cuerpo izquierdo-->
                <div class="izq"><%@include file="../../../bodyIzq.jsp" %></div>
                <div class="medio" style="border: 0px solid"><!-- here is the content -->
                   <h2 class="decorado">Nuevo Proveedor</h2>
                   <form method="post" id="formProvider" action="new">
                      <div style="clear:both;">
                          <label class="form_align43">Nombre :</label>
                          <input type="text" name="name" id="name" class="required form_input_align" maxlength="40" title="Ingrese el nombre."/>
                          <label class="error">*</label>                                                                                
                      </div>
                      <div style="clear:both;">
                          <label class="form_align43">Sigla :</label>
                          <input type="text" name="initials" id="initials" class="form_input_align" maxlength="6" title="Ingrese Sigla."/>
                          <label class="error"> </label>
                      </div>
                      <div style="clear:both;">
                          <label class="form_align43">Raz&oacute; :</label>
                          <input type="text" name="socialReason" id="socialReason" class="form_input_align" maxlength="70" title="Ingrese la Raz&oacute;n Social"/>
                          <label class="error"></label>
                      </div>
                      <div style="clear:both;">
                          <label class="form_align43">Nit :</label>
                          <input type="text" name="nit" id="nit" class="form_input_align" maxlength="20" title="Ingrese el NIT"/>
                          <label class="error"> </label>
                      </div>
                      <div style="clear:both;">
                      	<label class="form_align43">Pa&iacute;s :</label>
                      	<select name="countryId" id="countryId" class="required form_input_align" title="Seleccione un Pa&iacute;s">
						   <option value="">Seleccione un País</option>
						   <c:forEach var="country" items="${countries}">
								<option value="${country.countryId}">${country.name}</option>
							</c:forEach>
					  	</select>
					  	<label class="error">*</label>
					  </div>
					  <div style="clear:both;">
                      	<label class="form_align43">Region :</label>
                      	<select name="regionId" id="regionId" class="required form_input_align" title="Seleccione una Region">
                      		<option value="">Seleccione una Regi&oacute;n</option>
                      	</select>
					  	<label class="error">*</label>
					  </div>
					  <div style="clear:both;">
                      	<label class="form_align43">Localidad :</label>
                      	<select name="localityId" id="localityId" class="required form_input_align" title="Seleccione una Localidad">
                      		<option value="">Seleccione una Localidad</option>
                      	</select>
					  	<label class="error">*</label>
					  </div>
                      <div style="clear:both;">
                          <label class="form_align43">Direcci&oacute;n :</label>
                          <input name="address" id="address" class="required form_input_align" maxlength="100" title="Ingrese direcci&oacute;n"/>
                          <label class="error">*</label>
                      </div>
                      <div style="clear:both;">
                          <label class="form_align43">Email :</label>
                          <input name="email" id="email" class="form_input_align" maxlength="100" title="Ingrese Email"/>
                      </div>
                      <div style="clear:both;">
                          <label class="form_align43">Tel&eacute;fono 1 :</label>
                          <input name="phone" id="phone" class="required form_input_align" maxlength="20" title="Ingrese Telefono"/>
                          <label class="error">*</label>
                      </div>
                      <div style="clear:both;">
                          <label class="form_align43">Tel&eacute;fono 2 :</label>
                          <input name="phone2" id="phone2" class="form_input_align" maxlength="20" title="Ingrese Telefono 2"/>
                      </div>
                      <div style="clear:both;">
                          <label class="form_align43">Fax :</label>
                          <input name="fax" id="fax" class="form_input_align" maxlength="20" title="Ingrese Fax"/>
                      </div>
                      <div style="clear:both;">
                          <label class="form_align43">Fecha Creaci&oacute;n :</label>
                          <input name="dateCreation" id="dateCreation" class="form_input_align" maxlength="10" title="Ingrese Fecha de Creaci&oactue;n"/>
                      </div>
                      
                      <div class="form_center" style="clear:both;">
                          <input type="submit" value="Aceptar" name="action" class="boton" title="Pulsa aqui para" />&nbsp;
                          <input type="button" value="Cancelar" name="action" class="boton" title="Pulsa aqui para cancelar"/>
                      </div>
                  </form>
                </div>
            </div>
            <div class="yDer" style="border: 1px solid #ccc;">
                  <%@include file="../../../notices.jsp" %>                       
            </div><!--end of rightPan-->
        </div><!--end main content -->
	</div>
</div>
</body>
</html>
